<template>
    <div class = "HeartCourse">
        <h3 class = "top-title clearfix">
            <span class = "left">心理课</span>
            <span class = "right" @click = "toHeartCourseList">更多>></span>
        </h3>
        <div class="list">
            <HeartCourseCard v-for = "v in 3" :key = "v" url = "/pages/HeartCourseDetail/main"/>
        </div>
        <div class = "delimiter"></div>
        <div class = "comment">
            <h5>
                <span>问答</span>
                <span @click = "toSelectConsultation">我要提问</span>
            </h5>
            <ul class = "comment-container">
                <li class = "comment-item">
                    <h5>
                        <img src="http://192.168.31.134:8000/images/customer_1.png" alt="">
                        <span>叫我仙翁(昵称)</span>
                    </h5>
                    <div class = "comment-content">
                        <div class = "problem">
                            <img src="http://192.168.31.134:8000/images/comment_icon.png" alt="">
                            <AudioManager 
                            width = "565" 
                            url = "http://192.168.31.134:8000/music/music_1.mp3" 
                            />
                        </div>
                        <div class = "reply">
                            <div class = "reply-title">
                                <div class = "icon">
                                    <img src="http://192.168.31.134:8000/images/customer_1.png" alt="">
                                </div>
                                <div class = "description">
                                    <p>咨询师</p>
                                    <p>走自己的路,让别人无路可走</p>
                                </div>
                            </div>
                            <div class = "content">
                                你好，我想请问一下一个问题，第08期的文刊你好你好》在哪里？
                            </div>
                        </div>
                    </div>
                    <div class="comment-control">
                        <span>展开</span>
                        <span class = "time">2018-08-08</span>
                    </div>
                    <div class = "delimiter"></div>
                </li>
                <li class = "comment-item">
                    <h5>
                        <img src="http://192.168.31.134:8000/images/customer_1.png" alt="">
                        <span>叫我仙翁(昵称)</span>
                    </h5>
                    <div class = "comment-content">
                        <div class = "problem">
                            <img src="http://192.168.31.134:8000/images/comment_icon.png" alt="">
                            <span>你好，我想请问一下一个问题，第08期的文刊你好你好》在哪里？</span>
                        </div>
                        <div class = "reply">
                            <div class = "reply-title">
                                <div class = "icon">
                                    <img src="http://192.168.31.134:8000/images/customer_1.png" alt="">
                                </div>
                                <div class = "description">
                                    <p>咨询师</p>
                                    <p>走自己的路,让别人无路可走</p>
                                </div>
                            </div>
                            <div class = "content">
                                <AudioManager 
                            width = "565" 
                            url = "http://192.168.31.134:8000/music/music_1.mp3" 
                            />
                            </div>
                        </div>
                    </div>
                    <div class="comment-control">
                        <span>展开</span>
                        <span class = "time">2018-08-08</span>
                    </div>
                    <div class = "delimiter"></div>
                </li>
                <li class = "comment-item">
                    <h5>
                        <img src="http://192.168.31.134:8000/images/customer_1.png" alt="">
                        <span>叫我仙翁(昵称)</span>
                    </h5>
                    <div class = "comment-content">
                        <div class = "problem">
                            <img src="http://192.168.31.134:8000/images/comment_icon.png" alt="">
                            <span>你好，我想请问一下一个问题，第08期的文刊你好你好》在哪里？</span>
                        </div>
                        <div class = "reply">
                            <div class = "reply-title">
                                <div class = "icon">
                                    <img src="http://192.168.31.134:8000/images/customer_1.png" alt="">
                                </div>
                                <div class = "description">
                                    <p>咨询师</p>
                                    <p>走自己的路,让别人无路可走</p>
                                </div>
                            </div>
                            <div class = "content">
                                你好，我想请问一下一个问题，第08期的文刊你好你好》在哪里？
                            </div>
                        </div>
                    </div>
                    <div class="comment-control">
                        <span>展开</span>
                        <span class = "time">2018-08-08</span>
                    </div>
                </li>
            </ul>
        </div>
    </div>
</template>
<script>
import HeartCourseCard from "../../components/CourseCard";
import AudioManager from "./components/AudioManager";

export default {

    data(){
        return {

        }
    },
    methods: {
        //跳转心理课列表页
        toHeartCourseList(){
            wx.navigateTo({ url: '/pages/HeartCourseList/main' });
        },
        //跳转提问页面
        toSelectConsultation(){
            wx.navigateTo({ url: '/pages/SelectConsultation/main' });
        }
    },
    components: {
        HeartCourseCard,
        AudioManager
    }
}
</script>
<style lang = "scss" scoped>
    @import "index.scss";
</style>
